<template>
  <div class="mine">
    <div class="namecard">
      <div class="userinfo">
        <div class="left">
          <div class="userimage">
            <img :src="userinfo.photo" @click="userinfobtn" />
          </div>
          <div class="user">
            <div>{{ userinfo.name }}</div>
            <span>申请认证</span>
          </div>
        </div>
        <div class="right">
          <div class="container">
            <van-icon
              class-prefix="iconfont"
              name="iconfont icon-yuedu"
              color="#fff"
              size="20px"
            />
            <div class="font">
              <span>今日阅读</span>
              <br />
              <span>{{ userinfo.follow_count }}分钟</span>
            </div>
          </div>
        </div>
      </div>
      <van-grid :column-num="3" class="bgcb">
        <van-grid-item
          to="settings"
          :text="item.text"
          v-for="item in infolist"
          :key="item.text"
          class="bgc"
        >
          <template #icon>
            <div class="number">{{ item.number }}</div>
          </template>
        </van-grid-item>
      </van-grid>
    </div>
    <van-grid :column-num="3">
      <van-grid-item
        :text="item.text"
        to="settings"
        v-for="(item, index) in pages"
        :key="index"
      >
        <template #icon>
          <van-icon
            class-prefix="iconfont"
            :name="item.name"
            :color="item.color"
            size="20px"
          />
        </template>
      </van-grid-item>
    </van-grid>
    <van-cell-group>
      <van-cell
        :title="item.title"
        is-link
        :to="item.path"
        v-for="(item, index) in features"
        :key="index"
      />
    </van-cell-group>
    <van-cell-group>
      <van-cell class="loginout" @click="loginout"> 退出登陆 </van-cell>
    </van-cell-group>
  </div>
</template>

<script src='./index.js'/>

<style scoped lang="less" src='./index.less' />
